<html>

<head>
    <title>高校人力资源管理系统</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <!-- 引入样式 -->
    <link rel="stylesheet" href="lib/elementui/theme-chalk/index.css" type="text/css">
    <style>
        body {
            margin: 0px;
        }

        /* 所有 */
        #app {
            width: 100%;
            height: 100%;
        }

        /* 头 */
        .header {
            color: rgba(255, 255, 255, 0.75);
            line-height: 60px;
            background-color: #24292e;
            text-align: center;
        }

        .header div {
            display: inline;
        }

        .title {
        }

        .author {
            float: right;
        }

        .author-img {
            width: 20px;
            height: 20px;
        }

        .author-github {
            cursor: pointer;
        }

        /* 内容区 */
        .container {
            min-height: 600px;
            width: 100%;
            height: 100%
        }

        /* 左边内容区 */
        .left {
            color: #4b595f;
            width: 200px;
        }

        .left .totalUl {
            height: 93%;
        }

        /* 右边内容区 */
        .right {
            min-width: 200px;
        }

        tbody {
            font-size: 15px;
            color: #4b595f;
        }

        [v-cloak] {
            display: none;
        }
    </style>
    <script type="text/javascript" src="lib/vue.js"></script>
    <script type="text/javascript" src="lib/elementui/index.js"></script>
    <script src="lib/axios.min.js"></script>
    <script src="lib/myconfig.js"></script>
</head>
<body>
<div id="app">
    <el-container class="container">
        <el-header class="header">
            <div class="title">
                <span>高校人力资源管理系统</span>
            </div>
            <div class="author" v-cloak>
                <div @click="centerDialogVisible = !centerDialogVisible">
                    <i class="el-icon-location-outline author-github">{{info.username}}</i>
                    <img class="author-img author-github"
                         src="img/me.png" alt="head.png">
                </div>
            </div>
        </el-header>
        <el-dialog
                title="提示"
                :visible.sync="centerDialogVisible"
                width="30%"
                center>
            <span>是否退出登录</span>
            <span slot="footer" class="dialog-footer">
    <el-button @click="centerDialogVisible = false">取 消</el-button>
    <el-button type="primary" @click="logout">确 定</el-button>
  </span>
        </el-dialog>
        <el-container>
            <el-aside class="left">
                <el-menu :default-active="activeIndex" class="totalUl" v-cloak>
                    <el-menu-item index="1" @click="open(aboutMeUrl)"><i class="el-icon-service"></i>关于我</el-menu-item>
                    <el-submenu :index="firstMenu.id" v-for="firstMenu in menus" :key="firstMenu.id">
                        <template slot="title"><i :class="firstMenu.iconClass"></i>{{ firstMenu.name }}</template>
                        <el-menu-item-group v-for="secondMenu in firstMenu.children" :key="secondMenu.id">
                            <template slot="title">{{ secondMenu.name }}</template>
                            <el-menu-item v-for="thirdMenu in secondMenu.children" :index="thirdMenu.id"
                                          :key="thirdMenu.id" @click="open(thirdMenu.url)">{{ thirdMenu.name }}
                            </el-menu-item>
                        </el-menu-item-group>
                    </el-submenu>
                </el-menu>
            </el-aside>

            <el-main class="right">
                <iframe style="width:100%; height:100%; border: 0;" :src="iframeUrl"></iframe>
            </el-main>

        </el-container>
    </el-container>
</div>
<!-- 引入组件库 -->

<script type="text/javascript">
    new Vue({
        el: "#app",
        data: {
            activeIndex: "1",
            centerDialogVisible:false,
            aboutMeUrl: "",
            iframeUrl: "",
            info: {username: "欢迎"},
            form: {},
            visible: false,
            menus: []
        },
        methods: {
            logout() {
                location.href = "login.html";
            },
            open(url) {
                this.iframeUrl = url;
            },
            openIndex() {
                console.log("不是所有按钮都有用");
            }
        },
        mounted() {
            console.log("created");
            this.form.sid = getParam("sid");
            var aaa = this;
            axios.post(
                myurl + "/staff/findStaff",
                this.form
            ).then(function (res) {
                var resData = res.data;
                if (resData !== "") { //0表示成功，1表示失败
                    aaa.info = resData;
                    aaa.menus = getMenu(aaa.info.position);
                    console.log("me success" + aaa.info.position);
                } else {
                    console.log("me fail");
                }
                console.log(res);
                if (aaa.info.position === "应聘人员"||aaa.info.position === null) {
                    aaa.aboutMeUrl = "employment/employment.html?sid=" + getParam("sid");
                    aaa.iframeUrl = "employment/employment.html?sid=" + getParam("sid");
                }else {
                    aaa.aboutMeUrl = "aboutme.html?sid=" + getParam("sid");
                    aaa.iframeUrl = "aboutme.html?sid=" + getParam("sid");
                }
            });
        }
    });
</script>

</body>

</html>
